<template>
	<view class="AppHeaders" :style="{ height:statusBarHeight,backgroundColor: Y_bgcolor, color,zIndex:Zindex }"></view>
</template>

<script>
export default {
	name: '',
	props: {
		color: {
			type: String,
			default: '#000'
		},
		bgcolor: {
			type: String,
			default: '#fff'
		},
		Zindex:{
			type: String,
			default: '0'
		}
	},
	data() {
		return {
			heights: '0',
			Y_bgcolor: 'rgba(0, 0, 0, 0.5)',
			system: '10.0',
			statusBarHeight: '' // 状态栏高度
		};
	},
	async created() {
		// //#ifdef APP-PLUS
		// let res = await uni.getSystemInfo({});
		// if (!res[0]) {
		// 	this.system = res[1].system;
		// }
		// // #endif
		this.Y_bgcolor = this.system == '5.1.1' ? 'rgba(0, 0, 0, 0.5)' : 'transparent';
		this.bgcolor ? (this.Y_bgcolor = this.bgcolor) : '';
		
		
		// #ifdef APP-NVUE
		let _t = this;
		setTimeout(() => {
			//获取状态栏高度，setTimeout后才能调用uni.
			uni.getSystemInfo({
				success: function(res) {
					_t.statusBarHeight = res.statusBarHeight + 'px';
				}
			});
		}, 1);
		// #endif
	},
	mounted() {
		// #ifdef APP-PLUS
		this.heights = plus.navigator.getStatusbarHeight() + 'px';
		// #endif
	},
	methods: {
		open() {
			this.$emit('send');
		}
	}
};
</script>

<style scoped>
.AppHeaders {
	z-index: 99;
	position: sticky;
	top: 0;
}
</style>
